<template>
	<div class="dicm">
		<div class="table" v-show="parentDetailData.isTabelShow">
			<div class="container">
				<el-table stripe :data="tableData" border style="width: 100%" ref="multipleTable" v-loading="loading">
					<el-table-column prop="dictCategoryName" label="分类名称" width="150"></el-table-column>
					<el-table-column prop="dictKey" label="编码" width="150"></el-table-column>
					<el-table-column prop="dictName" label="名称" width="150"></el-table-column>
					<el-table-column label="内容">
						<template slot-scope="scope">
							<div v-html="scope.row.dictValue"></div>
						</template>
					</el-table-column>
					<el-table-column prop="seqNo" label="排序" width="100"></el-table-column>
					<el-table-column label="操作" width="100">
						<template slot-scope="scope">
							<el-button size="small" type="primary" @click="handleDetail(scope.$index, scope.row)">编辑</el-button>
						</template>
					</el-table-column>
				</el-table>
			</div>
		</div>
		<detail ref="detail" :id="id" :isAddable="hasMulti" :select_type="dictCategoryId" :dicTypes="dicTypes" :parentDetailData="parentDetailData" v-on:close="handleClose"></detail>
	</div>
</template>

<script>
	import detail from './detail'
	import service from '../../../../js/common/dicservice.js';

	export default {
		components: {
			detail
		},
		data() {
			return {
				tableData: [{
					id: 0,
					dictCategoryId: 0,
					dictCategoryName: '',
					dictKey: '',
					dictName: '',
					dictValue: '',
					seqNo:''
				}],
				parentDetailData: {
					isTabelShow: true
				},
				id: 0,
				total: 0,
				title: '新增',
				priDialogFormVisible: false,
				loading: true,
				dicTypes: [], //{type:1,value:'职业'},
				isEditable: false, //是否需要维护，编辑
				hasMulti: true, //有多条记录，添加
				haspost: false,
				dictCategoryId: 0
			}
		},
		created() {
			let self = this;
			setTimeout(function() {
				if(!self.haspost) {
					let parantid = self.$route.query.parentid;
					self.getDicsByParentId(parantid);
					self.getDicType(parantid);
				}
			}, 100);
		},
		computed: {
			data() {
				return this.tableData;
			}
		},
		watch: {
			'$route' (to, from) {
				let parantid = to.query.parentid;
				this.haspost = true;
				this.getDicsByParentId(parantid);
				this.getDicType(parantid);
			}
		},
		methods: {
			handleDetail(index, row) {
				let self = this;
				this.parentDetailData.isTabelShow = false;
				if(row != null && index != null) {
					this.id = row.id;
				} else {
					this.id = null;
				}
				this.$refs.detail.show();

			},
			handleEdit(index, row) {
				if(!index && !row) {
					this.title = "新增";
					this.priDialogFormVisible = true;
					this.modelData = {
						dictCategoryId: 1,
						dictValue: "",
						dictName: "",
						dictStatus: 1
					}
					return;
				} else {
					this.title = "编辑";
				}
				this.priDialogFormVisible = true;
				this.modelData = row;
				this.dictCategoryId = row.dictCategoryId;
			},
			handleClose(isRefreashList) {
				this.priDialogFormVisible = false;
				if(isRefreashList) {
					this.getDicsByParentId(this.$route.query.parentid);
				}
			},
			handleDelete(row) {
				service.handleDelete(this, row.id);

			},
			getDicType(parentId) {
				let self = this;
				let pageTypes = {
					pageNum: 1,
					pageSize: 1000,
					parentId: parentId
				}
				self.httptool.ajaxPost(self.apis.getDicTypes, pageTypes, res => {debugger;
					self.dicTypes = self.formattool.trimNull(res.data.list, []);					
				});
			},
			getDicsByParentId(parentId) {
				let self = this;
				let params = {
					parentId: parentId
				}
				self.httptool.ajaxPost(self.apis.getDicsByParentId, params, res => {
					let data = res.data;
					self.tableData = [];
					for(let i in data) {
						for(let j in data[i].dictList) {
							self.tableData.push({
								id: data[i].dictList[j].id,
								dictCategoryId: data[i].id,
								dictCategoryName: data[i].dictCategoryDesc,
								dictKey: data[i].dictList[j].dictKey,
								dictValue: data[i].dictList[j].dictValue,
								dictName: data[i].dictList[j].remark,
								seqNo: data[i].dictList[j].seqNo
							});
						}
					}
					self.loading = false;
				});
			}
		}
	}
</script>
<style src="./currentpage.less" lang="less"></style>